<html ng-app="myApp">

<head>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>天翼区块链路由器</title>
    <link href="<%=resource%>/imgs/favicon.ico" rel="shortcut icon" type="image/vnd.microsoft.icon">
    <link rel="stylesheet" href="<%=resource%>/index.css">
    <link rel="stylesheet" href="<%=resource%>/mobile.css">
    <script type="text/javascript" src="<%=resource%>/jquery/jquery-1.9.1.min.js"></script>
    <script type="text/javascript" src="<%=resource%>/js/menu.js"></script>
    <script src="<%=resource%>/angular/angular.js"></script>
    <script src="<%=resource%>/angular/angular-sanitize.min.js"></script>
    <script src="<%=resource%>/angular/angular-animate.min.js"></script>
    <script src="<%=resource%>/js/app/ngapp.js"></script>
    <script type="text/javascript" src="<%=resource%>/js/md5.js"></script>
    <link href="<%=resource%>/layer/skin/default/layer.css" rel="stylesheet">
    <script src="<%=resource%>/layer/layer.js"></script>
    <style>
        .align-left {
            display: inline-block;
            vertical-align: middle;
            width: 63%;
            margin-right: 10px;
        }
        
        .align-left>div:nth-of-type(2) {
            font-size: 12px;
            color: #5C5F66;
        }
        
        .align-right {
            display: inline-block;
            vertical-align: middle;
            width: 30%;
            text-align: right;
        }
        
        .align-right .notupver {
            background-color: #B8BECC;
        }
        
        .align-right button {
            color: #fff;
            background-color: #2292F5;
            border-radius: 4px;
            outline: none;
            padding: 7px;
            width: 100%;
            max-width: 100px;
            border: none;
        }
        
        .tab .row-interval {
            margin-bottom: 40px;
        }
        
        .tab .web-software {
            display: block;
            max-width: 682px;
            margin: 0 auto;
        }
        
        .tab .web-software .align-left>div:nth-of-type(1) {
            color: #2E3033;
            font-size: 16px;
        }
        
        .tab .mobile-software {
            display: none;
        }
        
        .llo .loading .log {
            width: 100%;
            max-width: 600px;
        }
        
        .loading .download-log {
            box-sizing: border-box;
            overflow-y: auto;
            background: #f2f2f2;
            padding: 10px 5px;
        }
        
        @media screen and (max-width: 768px) {
            .tab .web-software {
                display: none;
            }
            .tab .mobile-software {
                display: block;
            }
            .tab .row-interval {
                margin-bottom: 20px;
            }
        }
    </style>
</head>

<body style="background-color: #fff;">
    <div class="wrap">
        <div id="head">
            <span style="margin-left:60px;"></span><img src="<%=resource%>/imgs/logo.png">
            <span style="margin-left:20px;">天翼区块链路由器</span>
            <a href="javascript:" onclick="logout()" url='<%=luci.dispatcher.build_url("web", "logout")%>'>退出登录</a>
            <a href="http://www.skywindlink.com/" target="_blank">访问官网</a>
            <a class="qrcode">APP下载
              <div class="d">
                  <img src="<%=resource%>/imgs/qrcode.jpg">
              </div>
          </a>
        </div>
        <div id="head-phone" style="z-index: 199;">
            <div class="h-left">
                <span><img src="<%=resource%>/imgs/logo.png"></span>
                <span class="h-t">天翼区块链路由器</span>
            </div>
            <div class="h-right">
                <a href="http://www.skywindlink.com/" target="blank">访问官网</a><span class="h-line"> | </span><span class="h-app">APP下载</span>
                <img class="h-nav" src="<%=resource%>/imgs/h-nav.png" alt="">
                <div class="d">
                    <img src="<%=resource%>/imgs/qrcode.jpg">
                </div>
            </div>
        </div>
        <div id="phone-nav">
            <div class="nav-close"><img src="<%=resource%>/imgs/nav-close.png"></div>
            <div class="i" link='<%=luci.dispatcher.build_url("web", "system", "index")%>' style="margin-top: 40px">
                <div class="t"><img src="<%=resource%>/imgs/status.png">路由状态</div>
            </div>
            <div class="i " link='<%=luci.dispatcher.build_url("web", "system", "mnetwork")%>'>
                <div class="t"><img src="<%=resource%>/imgs/network.png">联网设置</div>
            </div>
            <div class="i" link='<%=luci.dispatcher.build_url("web", "system", "mwifi")%>'>
                <div class="t"><img src="<%=resource%>/imgs/wifi.png">WIFI设置</div>
            </div>
            <div class="i " link='<%=luci.dispatcher.build_url("web", "system", "mdevices")%>'>
                <div class="t"><img src="<%=resource%>/imgs/device.png">设备管理</div>
            </div>
            <div class="i " link='<%=luci.dispatcher.build_url("web", "system", "mfirewall")%>'>
                <div class="t"><img src="<%=resource%>/imgs/firewall.png">防火墙</div>
            </div>
            <div class="i " link='<%=luci.dispatcher.build_url("web", "system", "mdisk")%>'>
                <div class="t"><img src="<%=resource%>/imgs/disk.png">云盘</div>
            </div>
            <div class="i active" link='<%=luci.dispatcher.build_url("web", "system", "mconfig")%>'>
                <div class="t"><img src="<%=resource%>/imgs/config.png">常规设置</div>
            </div>
            <div class="logout"><span href="javascript:" onclick="logout()" url='<%=luci.dispatcher.build_url("web", "logout")%>'>退出登录</span></div>
        </div>
        <div class="container">
            <div id="menu">
                <div class="i " link='<%=luci.dispatcher.build_url("web", "system", "index")%>'>
                    <div class="t"><img src="<%=resource%>/imgs/status.png">路由状态</div>
                </div>
                <div class="i " link='<%=luci.dispatcher.build_url("web", "system", "mnetwork")%>'>
                    <div class="t"><img src="<%=resource%>/imgs/network.png">联网设置</div>
                </div>
                <div class="i " link='<%=luci.dispatcher.build_url("web", "system", "mwifi")%>'>
                    <div class="t"><img src="<%=resource%>/imgs/wifi.png">WIFI设置</div>
                </div>
                <div class="i" link='<%=luci.dispatcher.build_url("web", "system", "mdevices")%>'>
                    <div class="t"><img src="<%=resource%>/imgs/device.png">设备管理</div>
                </div>
                <div class="i " link='<%=luci.dispatcher.build_url("web", "system", "mfirewall")%>'>
                    <div class="t"><img src="<%=resource%>/imgs/firewall.png">防火墙</div>
                </div>
                <div class="i " link='<%=luci.dispatcher.build_url("web", "system", "mdisk")%>'>
                    <div class="t"><img src="<%=resource%>/imgs/disk.png">云盘</div>
                </div>
                <div class="i active" link='<%=luci.dispatcher.build_url("web", "system", "mconfig")%>'>
                    <div class="t"><img src="<%=resource%>/imgs/config.png">常规设置</div>
                </div>
            </div>
            <div class="content" ng-controller="configController">
                <div class="c">
                    <div class="lb">
                        <span>常规设置</span>&nbsp; >&nbsp;
                        <span id="child-title">管理员密码更改</span>
                    </div>
                    <div class="ct wifi-main">
                        <div style="background-color: #f5f5f5;overflow: hidden;">
                            <div class="tb">
                                <div class="tbs" style="width:50%;" index="0" ng-repeat="item in tabs" ng-click="switch($index)" ng-class="{'active': $index === currentTab && !isMobileWidth}">
                                    <span ng-class="{ 'tab-active' : $index === currentTab && isMobileWidth }">{{item}}</span>
                                </div>
                                <!-- <div class="tbs " style="width:50%;" index="1"><span>软件版本</span></div> -->
                            </div>
                        </div>
                        <div class="tab" ng-show="currentTab === 0">
                            <div class="row">
                                <div class="n-b">
                                    <div class="left-text">
                                        <div class="ti">原始密码</div>
                                    </div>
                                    <div class="right-text right-text-long">
                                        <div class="shrink-content">
                                            <input type="password" ng-model="adminuser.passwd">
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="n-b">
                                    <div class="left-text">
                                        <div class="ti">新密码</div>
                                    </div>
                                    <div class="right-text right-text-long">
                                        <div class="shrink-content">
                                            <input type="password" ng-model="adminuser.newpasswd">
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="n-b">
                                    <div class="left-text">
                                        <div class="ti">确认密码</div>
                                    </div>
                                    <div class="right-text right-text-long">
                                        <div class="shrink-content">
                                            <input type="password" ng-model="adminuser.newpasswd2">
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="n-b">
                                    <div class="left-text">
                                        <div class="ti"></div>
                                    </div>
                                    <div class="m-20 right-text right-text-long">
                                        <button class="btn2" ng-click="setPassword()">保存配置</button>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="tab" style="position: relative; z-index: 1;" ng-show="currentTab === 1">
                            <div class="mobile-software">
                                <div class="row-interval">
                                    <div class="align-left" ng-class="{ 'newver' : newClass }">
                                        <div>软件升级</div>
                                        <div>{{versionNum}}</div>
                                    </div>
                                    <div class="align-right">
                                        <button class="lt" ng-class="{ 'upver' : newClass, 'notupver': !newClass }" ng-click="showupgrade()">软件升级</button>
                                    </div>
                                </div>
                                <div class="row-interval">
                                    <div class="align-left">
                                        <div>重启路由器</div>
                                        <div>需要等待一段时间，期间所有设备将不能上网</div>
                                    </div>
                                    <div class="align-right">
                                        <button class="et" ng-click="setReboot()">重启路由器</button>
                                    </div>
                                </div>
                                <div class="row-interval">
                                    <div class="align-left">
                                        <div>恢复出厂设置</div>
                                        <div>将重启路由器，并清除路由器所配置的信息</div>
                                    </div>
                                    <div class="align-right">
                                        <button class="et" ng-click="setFactory()">恢复出厂设置</button>
                                    </div>
                                </div>
                                <div class="row-interval">
                                    <div class="align-left">
                                        <div>下载日志</div>
                                        <div>将下载的日志传给我们帮助您定位并解决问题</div>
                                    </div>
                                    <div class="align-right">
                                        <button class="et" ng-click="getlogs()">下载日志</button>
                                    </div>
                                </div>
                            </div>
                            <div class="web-software">
                                <div class="row-interval">
                                    <div class="align-left" ng-class="{ 'newver' : newClass }">
                                        <div>软件升级: &nbsp;&nbsp;&nbsp;{{versionNum}}</div>
                                    </div>
                                    <div class="align-right">
                                        <button class="lt" ng-class="{ 'upver' : newClass, 'notupver': !newClass }" ng-click="showupgrade()">软件升级</button>
                                    </div>
                                </div>
                                <div class="row-interval">
                                    <div class="align-left">
                                        <div>重启路由器: &nbsp;&nbsp;&nbsp;需要等待一段时间，期间所有设备将不能上网</div>
                                    </div>
                                    <div class="align-right">
                                        <button class="et" ng-click="setReboot()">重启路由器</button>
                                    </div>
                                </div>
                                <div class="row-interval">
                                    <div class="align-left">
                                        <div>恢复出厂设置: &nbsp;&nbsp;&nbsp;将重启路由器，并清除路由器所配置的信息</div>
                                    </div>
                                    <div class="align-right">
                                        <button class="et" ng-click="setFactory()">恢复出厂设置</button>
                                    </div>
                                </div>
                                <div class="row-interval">
                                    <div class="align-left">
                                        <div>下载日志: &nbsp;&nbsp;&nbsp;将下载的日志传给我们帮助您定位并解决问题</div>
                                    </div>
                                    <div class="align-right">
                                        <button class="et" ng-click="getlogs()">下载日志</button>
                                    </div>
                                </div>
                            </div>

                            <div class="llo" ng-show="bupgrade">
                                <div class="b"></div>
                                <div class="loading">
                                    <div class="c">
                                        <div class="hd">
                                            <span>请选择升级方式</span>
                                            <div class="ic"><img ng-click="canceupgrade()" src="<%=resource%>/imgs/close.png"></div>
                                        </div>
                                        <div class="cl">
                                            <input type="button" class="btn" value="本地文件升级" ng-click="updatelocal()">
                                            <input type="button" class="btn" value="远程升级" ng-click="updateremote()">
                                        </div>
                                        <div file-uploader url="fileurl" file="file" show="localshow"></div>
                                    </div>
                                </div>
                            </div>
                            <div class="llo" ng-show="showlogs">
                                <div class="b"></div>
                                <div class="loading">
                                    <div class="c log">
                                        <div class="hd">
                                            <span>系统日志</span>
                                            <div class="ic"><img ng-click="hidelogs()" src="<%=resource%>/imgs/close.png"></div>
                                        </div>
                                        <div class="download-log">
                                            {{logs}}
                                            <!-- <div style="margin:20px;">
                                              <div style="font-size:13px;text-align: left;">{{logs}}</div>
                                          </div> -->
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="hide">
                                <div id="loading">
                                    <div style="text-align:center;padding:40px;font-size:16px;">设置成功正在重启，需要30s等待...</div>
                                    <div style="text-align: center;"><img style="width:80px;height: 80px;" src="<%=resource%>/imgs/loading.gif"></div>
                                </div>
                            </div>
                            <div class="hide">
                                <div id="uploading">
                                    <div style="text-align:left;padding:40px;font-size:16px;">
                                        <div style="margin-bottom:10px;">1、路由器在升级过程中请勿断电、刷新或关闭页面,否则会导致升级失败。</div>
                                        <div>2、整个过程至少需要5分钟，请耐心等待。</div>
                                    </div>
                                    <div style="text-align: center;"><img style="width:80px;height: 80px;" src="<%=resource%>/imgs/loading.gif"></div>
                                </div>
                            </div>
                        </div>

                    </div>
                    <div class="footer-new2">
                        <span> Copyright©2018 skywindlink.com All Rights Reserved.</span>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="footer-new">
        <span> Copyright©2018 skywindlink.com All Rights Reserved.</span>
    </div>
</body>

</html>
<script type="text/javascript">
    app.controller('configController', function($scope, $http) {
        $scope.adminuser = {
            passwd: '',
            newpasswd: '',
            newpasswd2: ''
        };
        $scope.tabs = ['管理员密码更改', '软件版本'];
        $scope.currentTab = 0;
        $scope.isMobileWidth = false;
        $scope.versionData = {};
        $scope.versionNum = '';
        $scope.newClass = false;
        $scope.fileurl = '<%=luci.dispatcher.build_url("web", "system", "lupgrade")%>';
        $scope.file = null;
        $scope.localshow = false;
        $scope.bupgrade = false;
        $scope.showlogs = false;
        $scope.checkVersion = function() {
            var url = '<%=luci.dispatcher.build_url("web", "system", "checkver")%>'
            $http({
                method: 'POST',
                url: url,
                headers: {
                    'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8'
                }
            }).success(function(result) {
                var ver = result.data.ver;
                var version = result.data.version;
                $scope.versionNum = '当前版本号为' + ver;
                if (result.code === 0) {
                    if (ver !== version) {
                        $scope.newClass = true;
                        $scope.versionNum = '发现新版本，版本号为' + version;
                    } else {
                        $scope.newClass = false;
                    }
                } else {
                    $scope.newClass = false;
                }
            })
        };
        $scope.checkVersion();
        $scope.switch = function(index) {
            $scope.currentTab = index;
        }

        $scope.canceupgrade = function() {
            $scope.bupgrade = false;
            $scope.file = null;
        }
        $scope.showupgrade = function() {
            $scope.bupgrade = true;
            console.log($scope.file);
            // if ($scope.newClass) {
            //     $scope.bupgrade = true;
            //     console.log($scope.file);
            // } else {
            //     utils.alert('没有检测到升级固件')
            // }
        }
        $scope.updatelocal = function() {
            $scope.localshow = true;
        }
        $scope.updateremote = function() {
            $scope.localshow = false;
            var url = '<%=luci.dispatcher.build_url("web", "system", "checkver")%>';
            $http({
                method: 'POST',
                url: url,
                headers: {
                    'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8'
                }
            }).success(function(result) {
                if (result.code == 0) {
                    console.log(result.data);
                    var para = {
                        md5: result.data.md5,
                        url: result.data.url,
                        keep: 1
                    };
                    $scope.versionData = para;
                    if (result.data.force) {
                        $scope.forceUpdate();
                    } else {
                        utils.confirmdo("设备可升级到最新版本" + result.data.version + "是否升级?", $scope.forceUpdate);
                    }
                } else {
                    utils.alert(result.msg);
                }
            });
        }
        $scope.forceUpdate = function() {
            utils.loadingWithheight(300000, 250, $("#uploading").html());
            setTimeout(function() {
                window.location.href = 'http://192.168.188.1/cgi-bin/luci/'
            }, 300000);
            var url = '<%=luci.dispatcher.build_url("web", "system", "rupgrade")%>';
            var param = $scope.versionData;
            $http({
                method: 'POST',
                url: url,
                data: $.param(param),
                headers: {
                    'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8'
                }
            }).success(function(result) {
                if (result.code == 0) {
                    $scope.versionData = {};
                } else {
                    utils.alert(result.msg);
                }
            });
            $scope.versionData = {};
        };
        $scope.setPassword = function() {
            var password = $.trim($scope.adminuser.passwd);
            var newpasswd = $.trim($scope.adminuser.newpasswd);
            var newpasswd2 = $.trim($scope.adminuser.newpasswd2);
            if (password.length == 0) {
                utils.alert("密码不能为空");
                return;
            }
            if (newpasswd.length == 0) {
                utils.alert("新密码不能为空");
                return;
            }
            if (newpasswd2.length == 0) {
                utils.alert("确认密码不能为空");
                return;
            }
            if (password == newpasswd) {
                utils.alert("新旧密码一致不需要修改");
                return;
            }
            if (newpasswd != newpasswd2) {
                utils.alert("新密码和确认密码不一致");
                return;
            }
            var url = '<%=luci.dispatcher.build_url("web", "system", "passwdset")%>';
            var data = {
                passwd: $.md5($scope.adminuser.passwd),
                newpasswd: $.md5($scope.adminuser.newpasswd),
                newpasswd2: $.md5($scope.adminuser.newpasswd2)
            };
            $http({
                method: 'POST',
                url: url,
                data: $.param(data),
                headers: {
                    'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8'
                }
            }).success(function(result) {
                if (result.code == 0) {
                    utils.alert("设置成功");
                    window.location.href = "/cgi-bin/luci/";
                } else {
                    utils.alert(result.msg);
                }
            });
        };

        $scope.setReboot = function() {
            utils.confirmdo("确认重启路由器？", $scope.setRebootdo);
        };

        $scope.setRebootdo = function() {
            var url = '<%=luci.dispatcher.build_url("web", "system", "reboot")%>';
            $http({
                method: 'POST',
                url: url
            }).success(function(result) {
                if (result.code == 0) {
                    utils.loading(30000, $("#loading").html());
                }
            });
        };

        $scope.setFactory = function() {
            utils.confirmdo("确认恢复出厂设置？", $scope.setFactorydo);
        };

        $scope.setFactorydo = function() {
            var url = '<%=luci.dispatcher.build_url("web", "system", "factory")%>';
            $http({
                method: 'POST',
                url: url
            }).success(function(result) {
                if (result.code == 0) {
                    utils.loading(30000, $("#loading").html());
                }
            });
        };

        $scope.updateByFile = function() {
            var url = '<%=luci.dispatcher.build_url("web", "system", "lupgrade")%>';
            $http({
                method: 'POST',
                url: url
            }).success(function(result) {
                if (result.msg == "success") {
                    utils.alert("恢复成功");
                }
            });
        };

        $scope.getlogs = function() {
            var width = $(window).width();
            if (width < 768) {
                var height = $(window).height();
                height = height - 180;
                $('.download-log').height(height);
            } else {
                $('.download-log').height(500);
            }
            var url = '<%=luci.dispatcher.build_url("web", "system", "syslog")%>';
            $http({
                method: 'POST',
                url: url
            }).success(function(result) {
                if (result.code == 0) {
                    $scope.showlogs = true;
                    $scope.logs = result.data;
                    exportRaw('log.txt', result.data);
                }
            });

            function fakeClick(obj) {
                var ev = document.createEvent("MouseEvents");
                ev.initMouseEvent("click", true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
                obj.dispatchEvent(ev);
            }

            function exportRaw(name, data) {
                var urlObject = window.URL || window.webkitURL || window;
                var export_blob = new Blob([data]);
                var save_link = document.createElementNS("http://www.w3.org/1999/xhtml", "a")
                save_link.href = urlObject.createObjectURL(export_blob);
                save_link.download = name;
                fakeClick(save_link);
            }
        };
        $scope.hidelogs = function() {
            $scope.showlogs = false;
        };
        $scope.init = function() {
            var width = $(window).width();
            if (width < 768) {
                $scope.isMobileWidth = true
            }
        };
        $scope.init();
    });
</script>